<!-- 我的 – 非会员		mine -->
<template>
	<view class="">
		<view class="mine-lan"></view>
		<view class="mine-nicheng">
			<view class="pos-rel">
				<view v-if="token" class="f d c bold fs36" style="position:absolute;top:-90rpx;left:280rpx;">
					<image style="width: 196rpx;height: 196rpx;border-radius: 200rpx;" :src="data.img" mode=""></image>
					<text class="mt5">{{data.name}}</text>
				</view>
				<view v-else @click="gologin" class="f d c bold fs36" style="position:absolute;top:-90rpx;left:280rpx;">
					<image style="width: 196rpx;height: 196rpx;border-radius: 200rpx;" src="../../static/img/tou.jpg"
						mode=""></image>
					<text class="mt5">未登录</text>
				</view>
			</view>
			<view v-if="token" class="warps_box " style="padding-top: 160rpx;">
				<view class="dis-flex flex-center wd100">
					<view class="charts-box">
						<qiun-data-charts type="radar" :chartData="chartData" :errorShow="false" background="none" />
					</view>
				</view>
			</view>
			<view v-else style="height: 100rpx;width: 100%;"></view>
			<view class=" mt100" >
				<view class="w90" @click="toMhuiyuan()" v-if="data.is_vip == 1">
					<view class="f b c">
						<view class="vw25 f b c">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/029.png" mode=""></image>
							</view>
							<view>
								<text>我的会员</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="w90" @click="toMjiben()">
					<view class="f b c">
						<view class="vw25 f b c">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/022.png" mode=""></image>
							</view>
							<view>
								<text>基本信息</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="w90 p_t_15" @click="toMxiugai()">
					<view class="f b c">
						<view class="f b c" style="width:28vw;">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/023.png" mode=""></image>
							</view>
							<view>
								<text>修改手机号</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="w90 p_t_15" @click="toMkecheng()">
					<view class="f b c">
						<view class="vw25 f b c">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/024.png" mode=""></image>
							</view>
							<view>
								<text>我的课程</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="w90 p_t_15" @click="toMdaka()">
					<view class="f b c">
						<view class="vw25 f b c">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/025.png" mode=""></image>
							</view>
							<view>
								<text>我要打卡</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="w90 p_t_15" @click="toMhaoyou()">
					<view class="f b c">
						<view class="vw25 f b c">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/030.png" mode=""></image>
							</view>
							<view>
								<text>邀请好友</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="w90 p_t_15" @click="toMfankui()">
					<view class="f b c">
						<view class="vw25 f b c">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/026.png" mode=""></image>
							</view>
							<view>
								<text>我要反馈</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="w90 p_t_15" @click="toMxieyi()">
					<view class="f b c">
						<view class="vw25 f b c">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/027.png" mode=""></image>
							</view>
							<view>
								<text>用户协议</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="w90 p_t_15 mb50" @click="out()">
					<view class="f b c">
						<view class="vw25 f b c">
							<view>
								<image style="width: 25rpx;height: 25rpx;margin-top:12rpx;"
									src="../../static/img/027.png" mode=""></image>
							</view>
							<view>
								<text>退出登录</text>
							</view>
						</view>
						<view>
							<image style="width: 25rpx;height: 25rpx;" src="../../static/img/028.png" mode=""></image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="wd100 pos-abs" style="background-color: #1F73F2;height: 400rpx; top: 0;z-index: -1;"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				data: [],
				token: '',
				chartData: {
					"categories": [
						"B(呼吸习惯)",
						"F(空间坠落感)",
						"B(平衡漂浮能力)",
						"C(同步协调性)"
					],
					"series": [{
						"name": "",
						"data": [
							0,
							0,
							0,
							0
						],

					}],

				},
			}
		},
		onLoad() {
			// 动态导航条文字
			uni.setNavigationBarTitle({
				title: ''
			})
		},
		onShow() {
			this.token = uni.getStorageSync('token');
			this.init()
		},
		methods: {
			init() {
				var that = this
				that.$http.post(that.$config.UrlPostuserInfo, {}).then((res) => {
					if (res.status == 1) {
						that.data = res.data
						var arr = [that.data.breathing, that.data.coordination, that.data.balanced, that.data
							.falling
						]
						that.chartData.series[0].data = arr

						uni.setStorageSync('userInfo', res.data);
					}
				})
			},
			toMhuiyuan() {
				if (this.token) {
					var data = encodeURIComponent(JSON.stringify(this.data))
					uni.navigateTo({
						url: 'member/member?data=' + data
					})
				} else {
					this.$api.openWindow('/pages/login/login')
				}
			},
			out() {
				var that = this
				that.$api.alertConfirm('确认都退出当前账号?', () => {
					that.token = '';
					uni.removeStorageSync('token')
					uni.removeStorageSync('userInfo')
					this.init()
					that.$api.toast('退出成功')
				})
			},
			toMjiben() {
				if (this.token) {
					var data = encodeURIComponent(JSON.stringify(this.data))
					uni.navigateTo({
						url: 'basic/basic?data=' + data
					})
				} else {
					this.$api.openWindow('/pages/login/login')
				}
			},
			toMxiugai() {
				if (this.token) {
					uni.navigateTo({
						url: 'Modify/Modify'
					})
				} else {
					this.$api.openWindow('/pages/login/login')
				}
			},
			toMkecheng() {
				if (this.token) {
					uni.navigateTo({
						url: 'kecheng/kecheng'
					})
				} else {
					this.$api.openWindow('/pages/login/login')
				}
			},
			toMdaka() {
				if (this.token) {
					uni.navigateTo({
						url: 'punch/punch'
					})
				} else {
					this.$api.openWindow('/pages/login/login')
				}
			},
			toMhaoyou() {
				if (this.token) {
					uni.navigateTo({
						url: 'invite/invite'
					})
				} else {
					this.$api.openWindow('/pages/login/login')
				}
			},
			toMfankui() {
				if (this.token) {
					uni.navigateTo({
						url: 'feedback/feedback'
					})
				} else {
					this.$api.openWindow('/pages/login/login')
				}
			},
			toMxieyi() {
				if (this.token) {
					uni.navigateTo({
						url: 'agreement/agreement'
					})
				} else {
					this.$api.openWindow('/pages/login/login')
				}

			},
			gologin() {
				this.$api.openWindow('/pages/login/login')
			}
		}
	}
</script>
<style>
	page{
		background-color: #FFFFFF;
	}
</style>
<style scoped>
	.mine-lan {
		width: 750rpx;
		height: 340rpx;
	}

	.mine-nicheng {
		width: 750rpx;
		opacity: 1;
		background: #ffffff;
		border-radius: 40rpx 40rpx 0rpx 0rpx;
		top: 260rpx;
	}

	.content {
		width: 350rpx;
		height: 350rpx;
		margin-left: 400rpx;
	}

	/* 雷达图 */
	.charts-box {
		width: 100%;
		height: 400rpx;
	}

	.warps_box {
		width: 686rpx;
		height: 400rpx;
		background: #ffffff;
		border-radius: 16rpx;
		margin: 0 auto;
		margin-top: 30rpx;
	}
</style>
